

zxt.ui.MenuConfig = {       
	nextIcon                : zxt.cfg.IMAGES_PATH + '/efmenu_arrowright.png',
	disabledNextIcon        : zxt.cfg.IMAGES_PATH + '/efmenu_arrowright2.png',
	downIcon                : zxt.cfg.IMAGES_PATH + '/efmenu_arrowdown.png',
	useHover                : true
};

/**
 * <p>菜单,继承自zxt.ui.TreeTemplate
 * Tree constructor with treeModel, label and text. </p>
 * @class
 * @param {zxt.data.TreeModel} sModel 树状数据模型
 * @param {String} sLabel 标签
 * @param {String} sText  描述
**/
zxt.ui.Menu = function( sModel, sLabel, sText ) {
  this.base = zxt.ui.TreeTemplate;
  this.base( sModel, sLabel, sText );  
	
  this._horizental = true;
  this._width = 100;

  this._rootNode = null;  
  this._selected = null;    

  this._showTimeout = null;
  this._hideTimeout = null;

  this.textClicked = null;
  this.hoverExpand = null;  
};

zxt.defineClazz(zxt.ui.Menu, zxt.ui.TreeTemplate);

/**
 * <p>该方法有两个功能，如果参数未定义，则返回当前的宽度设置；否则，设置宽度</p> 
 * @function
 * @param {int} v 宽度
 * @return {int} 如果参数未定义，则返回当前的宽度设置
 */
zxt.ui.Menu.prototype.width = function(v){
  if (v == undefined) {	return this._width;	}
  this._width = v;
};

/**
 * <p>渲染DOM节点</p>
 * @function
 * @return {DOM} DOM节点
 */
zxt.ui.Menu.prototype.renderSelf = function(){
   if ( this._rootNode == null ){
     this._rootNode = new zxt.ui.MenuItem(this, null, null, this._text, false, null);
	 this._rootNode._opened = true;
   }
   return this._rootNode._renderSubMenu(this._horizental);//渲染子菜单
};

/**
 * <p>设置菜单选中事件</p>
 * @function
 * @param {zxt.ui.MenuItem} node 菜单项
 * @return
 */
zxt.ui.Menu.prototype.setSelected = function(node){
  if ( this._selected != null ){
    this._selected._jItemDIV.removeClass("ef-menu-item-selected");
  }
  if ( node._jItemDIV != null){
    node._jItemDIV.addClass("ef-menu-item-selected");
  }
  this._selected = node;
};

/* treeNode constructed with parnet node, label, text, isLeaf, and related data */
/**
 *<p>子菜单，继承自zxt.ui.TTNode;
 * this.base( sTree, sParent,</p>
 * @class
 * @param {zxt.ui.TreeTemplate} sTree zxt.ui.TreeTemplate
 * @param {zxt.ui.TTNode} sParent 父节点
 * @param {String} sLabel 标签
 * @param {String} sText  描述
 * @param {boolean} sLeaf 是否叶子节点
 * @param {object} sData 节点相关数据
 * 
 */
zxt.ui.MenuItem = function( sTree, sParent, sLabel, sText, sLeaf, sData ) {
  this.base = zxt.ui.TTNode;
  this.base( sTree, sParent, sLabel, sText, sLeaf, sData );
 
  this._horizental = false;

  this._userHover = this._getUserHover();//Hover的用户设置

  this._jItemDIV = null;
  this._jMenuDIV = null;
  this._needRender = true;
};

zxt.defineClazz(zxt.ui.MenuItem, zxt.ui.TTNode);

/**
 * @private
 * @function
 * @return
 */
zxt.ui.MenuItem.prototype._getUserHover = function(){
	var menu = this.tree();
	if ( menu.hoverExpand != null ){
		var u = menu.hoverExpand(this);
		if ( zxt.util.isAvailable(u) ){ return u; }
	}
	return zxt.ui.MenuConfig.useHover;
};

/**
 * <p>菜单项文本单击方法事件</p>
 * @function
 * @return
 */
zxt.ui.MenuItem.prototype.onTextClicked = function( ){
  var menu = this.tree();
  if ( !this._userHover ){
    if ( this._opened ) {
      this.collapse();//收起
    } else {
      this.expand();//展开
    }
  }
  if ( menu.textClicked != null ) {
    menu.textClicked(this);
  }
};

/**
 * <p>鼠标悬停事件<p>
 * @function
 * @return
 */
zxt.ui.MenuItem.prototype.onMouseOver = function( ){
  var menu = this.tree();
  menu.setSelected( this );
  if ( this._userHover ){
    this.expand();	
  } 
};

/**
 * <p>鼠标移开事件</p>
 * @function
 * @return
 */
zxt.ui.MenuItem.prototype.onMouseOut = function( ){
  var menu = this.tree();
  if ( this._userHover ){
    var host = menu._rootNode;
    menu._hideTimeout = window.setTimeout( function(){ host.collapse(); } , 100);
  }  
};

/**
 * <p>子菜单收起</p>
 * @return
 */
zxt.ui.MenuItem.prototype.collapse = function() {
  this._needRender = this._opened;
  this._hidesubs();
  if ( this._label != null ){	
    this._opened = false;
    this.render();
  }  
};

/**
 * <p>子菜单展开</p>
 * @function
 * @return
 */
zxt.ui.MenuItem.prototype.expand = function() {  
  var menu = this.tree();
  if (menu._showTimeout != null)	window.clearTimeout(menu._showTimeout);
  if (menu._hideTimeout != null)	window.clearTimeout(menu._hideTimeout);
  this.load();    
   
  if (  this._label != null ) {
    this._parent._hidesubs();
	this._needRender = this._opened?false:true;
    this._opened = true; 
    this.render();
  } 
};

/**
 * <p>隐藏子菜单</p>
 * @private
 * @function
 * @return
 */
zxt.ui.MenuItem.prototype._hidesubs = function() { 
  for (var i = 0; i < this._childNodes.length; i++) {
    var _node = this._childNodes[i];
	_node.collapse();		
  }
};

/**
 * <p>创建子菜单节点</p>
 * @private
 * @function
 * @param child
 * @return
 */
zxt.ui.MenuItem.prototype._createChildNode = function(child){
  return new zxt.ui.MenuItem( this.tree(), this, child['label'], child['text'], child['leaf']=="1", child );
};

/**
 * <p>渲染子菜单节点</p>
 * @private
 * @function
 * @param {boolean} hor 水平or竖直设置 true:水平设置
 * @return
 */
zxt.ui.MenuItem.prototype._renderSubMenu = function(hor){
  var horizental = hor | false;
  var menu = this.tree();
  var children = this.getChildNodes();
  if ( children.length > 0 ) {
    if ( this._jMenuDIV == null ) {
      this._jMenuDIV = $("<div>");
	  if ( horizental ) {
        this._jMenuDIV.toggleClass( "ef-menu-bar" );  
	  } else {
        this._jMenuDIV.toggleClass( "ef-menu" );  
      }
	  this._jMenuDIV.css("visibility","visible");
	  this._jMenuDIV.css("width", menu._width);
      for( var tmp in children ){
        var child = children[tmp];
		child._horizental = horizental;
	    this._jMenuDIV.append( child.render() );
      }

	  var jqIframe = $("<iframe src='javascript:false' style='border:0;position:absolute;visibility:inherit;top:0px;left:0px;width:180px;height:800px;z-index:-1;filter=\"progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)\";'></iframe>");
      this._jMenuDIV.append(jqIframe);
    }
	
	return this._jMenuDIV.get(0);
  } else {
	  return null;
  }
};

/**
 * <p>渲染子菜单DOM节点</p>
 * @function
 * @return
 */
zxt.ui.MenuItem.prototype.renderSelf = function(){
  var renderAsLeaf = this._leaf;
  if ( this._jItemDIV == null ) {
	this._jItemDIV = $("<a href='#'/>");	
	var instance = this;	
	this._jItemDIV.click( function(){ instance.onTextClicked(); } );//关联鼠标点击事件
	this._jItemDIV.mouseover( function(){ instance.onMouseOver(); });//关联鼠标悬停事件
    this._jItemDIV.mouseout( function(){ instance.onMouseOut();	});   //关联鼠标移开事件
	    
    if ( renderAsLeaf ){
      this._jItemDIV.html( this._text );
    } else {
      if ( this._horizental ){
        var _h = this._text + "<img class='arrow' src=\"" + zxt.ui.MenuConfig.downIcon + "\" align='absmiddle'>";
	    this._jItemDIV.html( _h );
      } else {
        var _h = "<img class='arrow' src=\"" + zxt.ui.MenuConfig.nextIcon + "\" align='absmiddle'>" +	this._text;
        this._jItemDIV.html( _h );
      }    
    }
  }
  
  if ( renderAsLeaf || !this._needRender ){
    return this._jItemDIV.get(0);
  }

  if ( this._opened ) {
	  var divElement = this._renderSubMenu();
      if ( divElement != null  ) {
		//this._jMenuDIV.css("visibility","visible");  
        document.body.appendChild( divElement );
	    zxt.util.dom.postionWithRel( divElement, this._jItemDIV.get(0), !this._horizental );
      }
    } else {
	  if ( this._jMenuDIV != null ) {
          var divElement = this._jMenuDIV.get(0);
		  //this._jMenuDIV.css("visibility","hidden");
		  if ( divElement.parentNode != null ) {
            divElement.parentNode.removeChild(divElement);
		  }
	  }
    }
  
  return this._jItemDIV.get(0);
};
